<%@ page import="org.ikastola.Receipt" %>

<g:javascript src="jquery.multiselect.filter.js" />
<g:javascript src="jquery.multiselect.js" />
<script type="text/javascript">
	$(document).ready(function() {
		$("#checks").hide();
		$("#paymentcheck").click(function () {
			if ($(this).is(':checked')) {
				$("#checks").show();
			} else {
				$("#checks").hide();
			}
		});
		$("[name^=fee-]").each(function() {
			 $(this).change(function(){
				 $("#totalpay").val(getTotal());
			 });
		});
		$("[name^=ex-fee-]").each(function() {
			 $(this).click(function(){
				 var id = $(this).attr("name").split("-")[2]; 
				 if($(this).prop("checked")) {
					 $("[name^=fee-"+id+"]").attr("disabled",true);
					 $("[name^=fee-"+id+"]").val("0");
				 } else {
					 $("[name^=fee-"+id+"]").removeAttr("disabled");
				 }
			 });
		});

		$(".formaccordion").accordion({
			collapsible: true,
			active: false,
			heightStyle: "content"
	 	});

	 	updateCheckBox();

	 	$(".tooltip").tooltip();
	});

	$.widget("ui.tooltip", $.ui.tooltip, {
	    options: {
	        content: function () {
	            return $(this).prop('title');
	        }
	    }
	});
	
	function getTotal() {
		var v = 0;
		 $("[name^=fee-]").each(function() {
			 var i = 0;	
			 if($(this).val().trim() != "") {
				 i = $(this).val();
			 }
			 v += parseFloat(i);
		 });
		 return v.toFixed(2);
	}

	function submitReceiptForm() {
		var valid = true;
		$("[name^=fee-]").each(function(){
			if (!this.validity.valid) {
				valid = false;
			}
		});
		if (valid) {
			$("#receiptForm").submit();
		} else {
			alert("Valor a pagar no va\u0301lido")
			return false;
		}
	}

	function updateCheckBox() {
		$("[name^=ex-fee-]").each(function() {
			 var id = $(this).attr("name").split("-")[2]; 
			 if($(this).prop("checked")) {
				 $("[name^=fee-"+id+"]").attr("disabled",true);
				 $("[name^=fee-"+id+"]").val("0");
			 } else {
				 $("[name^=fee-"+id+"]").removeAttr("disabled");
			 }
		});
	}
</script>
<br/>
<div class="">
	<label for="total" style="margin:0px 1.25em 5px 0px;color:rgb(102, 102, 102);font-weight: bold;">
		<g:message code="receipt.total.label" default="Total" />
	</label>
	$ <g:formatNumber number="${total}" type="number" maxFractionDigits="2" roundingMode="HALF_DOWN" />
</div>
<div class="">
	<label for="total2" style="margin:0px 1.25em 5px 0px;color:rgb(102, 102, 102);font-weight: bold;">
		<g:message code="receipt.total2.label" default="Total con recargos y bonificaciones" /> 
	</label>
	 $ <g:formatNumber number="${total2}" type="number" maxFractionDigits="2" roundingMode="HALF_DOWN" />
</div>
<div class="">
	<label for="total3" style="color:rgb(102, 102, 102);font-weight: bold;">
		<g:message code="receipt.totalpay.label" default="Total a pagar" />
	</label>
	<g:field type="text" name="totalpay" value="" readonly="readonly" />
</div>
<br/>
<div class="sep" style="border-bottom: 1px dashed rgb(221, 221, 221); margin: 10px 0px;"></div>
<br/>
	<table>
			<thead>
				<tr>
				<th><g:message code="receipt.fees.label" default="Fees" /></th>
				<th><g:message code="a" default="Costo" /> </th>
				<th><g:message code="a" default="Deuda" /> </th>
				<th><g:message code="a" default="A Pagar" /> </th>
				<th><g:message code="a" default="Periodo"/></th>
				<th><g:message code="a" default="Recargo" /></th>
				<th><g:message code="a" default="Bonificacion" /></th>
				<th><g:message code="a" default="Total" /></th> 
				<th><g:message code="a" default="Excluir" /></th>
<%--				<th><g:message code="a" default="Detalles" /></th>--%>
				</tr>
			</thead>
			<tbody>
				<g:each in="${formRecords}" var="b" status="i">
					<tr class="${(i % 2) == 0 ? 'even' : 'odd'}">
						<g:if test="${b?.fee?.feeDetails}">
							<td class="tooltip" title="<g:each in='${b?.fee?.feeDetails}' var='fd'><b>${fd?.name}</b>:&nbsp;$${fd?.value}<br/></g:each>" >
						</g:if>
						<g:else><td></g:else>
						${b?.fee?.name?.encodeAsHTML()}
						</td>
						<td>${b?.value}</td>
<%--						<input type="hidden" name="val-fee-${b?.fee?.id}" value="${b?.value}"/> --%>
						<td>${b?.due}</td>
<%--						<input type="hidden" name="due-fee-${b?.fee?.id}" value="${b?.due}"/>--%>
						<td>
						<input type="number" name="fee-${b?.fee?.id}" value="0" step="${ikastola.Constants.DOUBLE_STEP}" title="El valor debe comenzar con un n&uacute;mero, usar punto como separador de decimal y redondear a 0.05."/>
						</td>
						<td>
						<g:if test="${b?.fee?.period == '1'}" >
							<g:formatDate date="${b?.period}" format="MM'/'yyyy"/>
						</g:if>
						<g:else>
							<g:formatDate date="${b?.period}" format="yyyy"/>
						</g:else>
<%--						<input type="hidden" name="period-fee-${b?.fee?.id}" value="${formatDate(date:b?.period, format:'yyyy-MM-dd HH:mm:ss')}"/>--%>
						</td>
						<td>${b?.interest}</td>
<%--						<input type="hidden" name="inter-fee-${b?.fee?.id}" value="${b?.interest}"/>--%>
						<td>-${b?.bonus}</td>
<%--						<input type="hidden" name="bonus-fee-${b?.fee?.id}" value="${b?.bonus}"/>--%>
						<td>${b?.finalTotal}</td>
<%--						<input type="hidden" name="ftot-fee-${b?.fee?.id}" value="${b?.finalTotal}"/>--%>
						<td><g:checkBox name="ex-fee-${b?.fee?.id}" value="${b?.exclude}"/></td>
						
<%--						<td>--%>
<%--						<g:if test="${b?.fee?.feeDetails}">--%>
<%--							<g:each in="${b?.fee?.feeDetails}" var="feedet">--%>
<%--								${fieldValue(bean: feedet, field: "name")}<br/>--%>
<%--								${fieldValue(bean: feedet, field: "value")}<br/>--%>
<%--							${fieldValue(bean: feedet, field: "description")}--%>
<%--							</g:each>--%>
<%--						</g:if>--%>
<%--						</td>--%>
					</tr>
				</g:each>
			</tbody>
	</table>

<%-- 
<label>Nuevos items</label>	

<div class="fieldcontain" >
	<input type="button" value='<g:message code="additem.button.label"/>' id="addButton" />
	<input type="button" value='<g:message code="delitem.button.label"/>' id="removeButton" />
</div>
<div id="newDetails">
</div> --%>



<br/>
<g:if test="${discounts}">
	<table>
			<thead>
				<tr>
				<th><g:message code="receipt.discounts.label" default="Discounts" /></th>
				<th><g:message code="a" default="Descripcion"/></th>
				<th><g:message code="a" default="Bonificacion" /> </th>
				<th><g:message code="a" default="Aplica sobre" /> </th>
				<%-- <th><g:message code="a" default="Excluir" /></th> queda pendiente --%>
				</tr>
			</thead>
			<tbody>
				<g:each in="${discounts}" var="d" status="i">
					<tr class="${(i % 2) == 0 ? 'even' : 'odd'}">
						<td>${d?.name}</td>
						<td>${d?.description}</td> 
						<td>${d?.value}</td>
						<td>Cuotas</td>
						<%--<td><g:checkBox name="dis-ex-${d?.id}" value="${false}"/></td> queda pendiente --%>
					</tr>
				</g:each>
			</tbody>
	</table> 
</g:if>

<%--<g:hiddenField name="student" value="${fieldValue(bean: receiptInstance?.student, field: 'id')}" />--%>
